import React from 'react';
import { Col, Empty, Form, Row, Tag, Tooltip } from 'antd';
import IconFont from '@/components/IconFont';
import AuthComponent from '@/utils/auth/AuthComponent';
import { history } from 'umi'
import FormContainer, { fullRowFormItemLayout } from './FormContainer';

/**
 * 员工档案 - 在职信息 - 在职信息
 */
const PositionSection = ({ formData }) => (
    // render
    <FormContainer title="在职信息" hasEditAuth={false}>
        {() =>
            formData ? (
                <>
                    <Row gutter={24}>
                        <Col span={12}>
                            <Form.Item label="工号">
                                <span>{formData?.userNo || '--'}</span>
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item label="身份">
                                <span style={{ marginRight: 8 }}>
                                    {['主管', '主管', '普通用户'][formData?.employeeType]}
                                </span>
                                {/* responsibleOrgList 中包含多条审批中的记录 */}
                                {formData?.employeeTypeInfo?.responsibleOrgList?.length > 0 && (
                                    <a
                                        onClick={() =>
                                            history.push({
                                                pathname: '/personal/portal/myAuditRead/myAuditReadDetail',
                                                query: {
                                                    applicationNo:
                                                        formData.employeeTypeInfo.responsibleOrgList[0].applicationNo
                                                },
                                                state: { tabRoute: true, tabRefresh: true }
                                            })
                                        }
                                    >
                                        <Tag color="#FDF3E7" style={{ color: '#ffa22d', cursor: 'pointer' }}>
                                            审批中
                                        </Tag>
                                    </a>
                                )}
                                <AuthComponent code="office:orgs:employee:leaderInfo:detail">
                                    <Tooltip title="查看主管信息">
                                        <IconFont
                                            isButton
                                            style={{
                                                fontSize: '20px',
                                                verticalAlign: '-2px'
                                            }}
                                            icon="iconchakanxiangqing"
                                            onClick={() =>
                                                history.push({
                                                    pathname:
                                                        '/office/personnelManagement/organization/employeeList/supervisor',
                                                    query: {
                                                        employeeCode: formData?.employeeCode
                                                    }
                                                })
                                            }
                                        />
                                    </Tooltip>
                                </AuthComponent>
                            </Form.Item>
                        </Col>
                    </Row>
                    <Row gutter={24}>
                        <Col span={12}>
                            <Form.Item label="组织机构">
                                <span>{formData?.departmentName || '--'}</span>
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item label="行政机构">
                                <span>{formData?.administrativeOrganizationName || '--'}</span>
                            </Form.Item>
                        </Col>
                    </Row>
                    <Row gutter={24}>
                        <Col span={12}>
                            <Form.Item label="岗位">
                                <span>{formData.dutyAlias || '--'}</span>
                            </Form.Item>
                        </Col>
                    </Row>
                    <Row gutter={24}>
                        <Form.Item label="岗位描述" {...fullRowFormItemLayout}>
                            <div
                                className="multiLineText"
                                dangerouslySetInnerHTML={{
                                    __html: formData?.dutyDesc
                                        ? formData?.dutyDesc.replace(/(\r\n|\n|\r)/g, '<br />')
                                        : '--'
                                }}
                            />
                        </Form.Item>
                    </Row>
                    <Row gutter={24}>
                        <Col span={12}>
                            <Form.Item label="职位职级">
                                <span>{formData?.rankValue || '--'}</span>
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item label="职位类别">
                                <span>{formData?.rankTypeName || '--'}</span>
                            </Form.Item>
                        </Col>
                    </Row>
                    <Row gutter={24}>
                        <Form.Item label="职位要求" {...fullRowFormItemLayout}>
                            <div
                                className="multiLineText"
                                // eslint-disable-next-line react/no-danger
                                dangerouslySetInnerHTML={{
                                    __html: formData?.positionDescription?.replace(/[\r\n]+/g, '<br />')
                                }}
                            />
                        </Form.Item>
                    </Row>
                </>
            ) : (
                <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
            )
        }
    </FormContainer>
);

export default PositionSection;
